var aleft = document.querySelector('.auto .aright a.leftBtn')
var aright = document.querySelector('.auto .aright a.rightBtn')
var ul = document.querySelectorAll('.auto .aright ul')
var lis = document.querySelectorAll('.auto .aright .aul li')
var abox = document.querySelector('.auto .aright')
var ex = 0
var ss
// var brr = [
//     [
//     'https://img14.360buyimg.com/pop/s380x300_jfs/t1/220883/21/14955/41924/623446a6E7f6c51e9/4002c9c0435ed856.jpg.webp',
//     'https://img13.360buyimg.com/babel/s380x300_jfs/t1/96983/40/21058/99053/61d57a93Ed5d47c2f/ffce68b5ad102f55.png.webp alt=',
//     'https://img12.360buyimg.com/babel/s380x300_jfs/t1/152314/13/19839/57522/603e118dE941f0ce9/fdff58457adbef3e.jpg.webp'
//     ],
//     [
//     'https://img20.360buyimg.com/babel/s380x300_jfs/t1/169562/17/27598/86466/61b83ffbEb9b01749/7f0fe23eaaf48b4e.jpg.webp',
//         'https://img30.360buyimg.com/babel/s380x300_jfs/t1/165019/40/8639/60165/603d92e5E1d9852b8/2006d88391f60fe8.jpg.webp',
//         'https://img10.360buyimg.com/babel/s380x300_jfs/t1/179822/25/5393/75049/60a86e86Edafc14d5/5e9eb0f22d1f6b77.jpg.webp'
//     ],
//     [
//     'https://img11.360buyimg.com/babel/s380x300_jfs/t1/156373/29/12285/68780/603f2b75E4fd09458/a6aa23f1163ff561.jpg.webp',
//     'https://img14.360buyimg.com/babel/s380x300_jfs/t1/168591/2/9328/64891/603ddb1aE93567699/3e4e717eeac051b2.jpg.webp',
//     'https://img20.360buyimg.com/pop/s380x300_jfs/t1/185240/39/21940/98393/624540fdEed74e131/c7d3adc663b090d6.png.webp'
//     ]
// ]
// brr.forEach(v => {
//     var li = document.createElement('li')   
//     var html = ''
//     v.forEach(v =>{
//         html+=`
//         <img src="${v}"  style="margin-top: 6px;"  />   
//         `
//     })
//     li.innerHTML = html
//     ul.appendChild(li)
// })

aright.onclick= () =>{   
    ex++
    if(ex >=3){
        ex = 0
    }
    for(var j =0;j<ul.length;j++){
       ul[j].className = ''
    }
    ul[ex].className = 'active'
}
ss = setInterval(function(){
    aright.onclick()
},4000)

abox.onmouseover = function(){
    clearInterval(ss)
}

abox.onmouseout = function(){
    ss = setInterval(function(){
        aright.onclick()
    },4000)
}
aleft.onclick= () =>{   
    ex--
    if(ex < 0){
        ex = 2
    }
    for(var j =0;j<ul.length;j++){
       ul[j].className = ''
    }
    ul[ex].className = 'active'
}